<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
</head>
<body>
    <!-- 
        一、this是什么: 
            1、任何函数本质上都是通过某个对象来调用的，如果没有指定就是window
            2、所有函数的内部都有一个this
            3、this的值是调用当前函数的对象
        
        二、如何确定this的值
            1、test() this是window
            2、p.test() this是p
            3、new test() this是新实例化的对象
            4、p.call(obj) this是obj
     -->
    <script>
        function fun (color) { 
            console.log(this.color)
            this.color = color
            this.getColor = function () { 
                console.log(this.color)
                return this.color
            }
            this.setColor = function (color) { 
                console.log(this.color)
                this.color = color
            }
        }

        fun('red') // this是window

        const f = new fun('yello')  // this是 f

        f.getColor()  // this 是f

        const obj = {} 
        f.setColor.call(obj, 'black')  // this是obj, call函数是把任意函数暂时放到指定对象中去

        const test = f.setColor
        test() // this是Window


        function test2 () { 
            function test3 () { 

            }

            test3() // this是window
        }
        test2() // this是window
    ;</script>
</body>
</html>